package com.example.treehole.ui.component

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.Dashboard
import androidx.compose.material.icons.outlined.Forest
import androidx.compose.material.icons.outlined.Person
import androidx.compose.material3.Icon
import androidx.compose.material3.NavigationBar
import androidx.compose.material3.NavigationBarItem
import androidx.compose.material3.NavigationBarItemDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.navigation.NavController
import androidx.navigation.compose.currentBackStackEntryAsState
import com.example.treehole.LocalSquareViewModel
import com.example.treehole.ui.model.PostType
import com.example.treehole.ui.theme.Cyan
import com.example.treehole.ui.theme.darkCyan
import com.example.treehole.ui.theme.postCyan

@Composable
fun BottomNavigationBar(navController: NavController) {
    val squareViewModel = LocalSquareViewModel.current
    val selectedTag by squareViewModel.selectedTag.collectAsState()
    val currentDestination = navController.currentBackStackEntryAsState().value?.destination
    val selectItem = when (currentDestination?.route) {
        "treehole" -> 0
        "square" -> 1
        "myself" -> 2
        else -> 3
    }


    Box(
        modifier = Modifier
            .fillMaxWidth()
            .navigationBarsPadding()
            .background(
                brush = Brush.horizontalGradient(
                    colors = listOf(Cyan, darkCyan)
                )
            )
            .padding(top = 4.dp)
            .height(56.dp),
        contentAlignment = Alignment.Center
    ) {
        NavigationBar(
            containerColor = Color.Transparent,
            contentColor = Cyan,
            modifier = Modifier
                .fillMaxWidth()
        ) {
            NavigationBarItem(
                icon = {
                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally
                    ) {
                        Icon(Icons.Outlined.Forest, contentDescription = "Treehole")
                        Spacer(modifier = Modifier.height(2.dp))
                        Text("树洞", fontSize = 12.sp)
                    }

                },
                selected = selectItem == 0,
                onClick = {
                    navController.navigate("treehole")
                },
                colors = NavigationBarItemDefaults.colors(
                    selectedIconColor = postCyan,
                    selectedTextColor = postCyan,
                    indicatorColor = Color.Transparent
                )
            )
            NavigationBarItem(
                icon = {
                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally
                    ) {
                        Icon(Icons.Outlined.Dashboard, contentDescription = "Square")
                        Spacer(modifier = Modifier.height(2.dp))
                        Text("广场", fontSize = 12.sp)
                    }

                },
                selected = selectItem == 1,
                onClick = {
                    if(selectItem == 1 && selectedTag != PostType.NO_TYPE) squareViewModel.updateTag(PostType.NO_TYPE)
                    navController.navigate("square")
                },
                colors = NavigationBarItemDefaults.colors(
                    selectedIconColor = postCyan,
                    selectedTextColor = postCyan,
                    indicatorColor = Color.Transparent
                )
            )
            NavigationBarItem(
                icon = {
                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally
                    ) {
                        Icon(Icons.Outlined.Person, contentDescription = "Myself")
                        Spacer(modifier = Modifier.height(2.dp))
                        Text("我的", fontSize = 12.sp)
                    }

                },
                selected = selectItem == 2,
                onClick = {
                    navController.navigate("myself")
                },
                colors = NavigationBarItemDefaults.colors(
                    selectedIconColor = postCyan,
                    selectedTextColor = postCyan,
                    indicatorColor = Color.Transparent
                )
            )
        }
    }
}

